<template>
  <div>
    <el-card>
      <div slot="header">
        <span>发布网络招聘会</span>
        <el-button
          type="text"
          style="float: right; padding: 0px; margin-left: 14px" @click="back"
          >返回</el-button
        >
        <el-button
          type="text"
          style="float: right; padding: 0px; margin-left: 14px"
          >保存</el-button
        >
      </div>
      <div>
        <el-form ref="form" :model="form" label-width="120px">
          <el-form-item label="标题">
            <el-input placeholder="" style="width: 35%"></el-input>
            <span style="color: #999; margin-left: 10px">
              <i class="el-icon-info"></i>
              (如：2017年5月1日医药行业主题招聘会)
            </span>
          </el-form-item>
          <el-form-item label="举办日期">
            <el-date-picker
              v-model="value1"
              type="datetimerange"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :default-time="['12:00:00']"
            >
            </el-date-picker>
          </el-form-item>
          <el-form-item label="招聘会介绍"></el-form-item>
          <el-form-item label="允许报名套餐">
            <el-checkbox-group v-model="checkList">
              <el-checkbox label="复选框 A"></el-checkbox>
              <el-checkbox label="复选框 B"></el-checkbox>
              <el-checkbox label="复选框 C"></el-checkbox>
              <el-checkbox label="禁用" disabled></el-checkbox>
              <el-checkbox label="选中且禁用" disabled></el-checkbox>
            </el-checkbox-group>
          </el-form-item>
          <el-form-item label="仅认证企业报名">
            <el-switch></el-switch>
          </el-form-item>
          <el-form-item label="要求简历完整度">
            <el-input placeholder="" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item label="浏览次数">
            <el-input placeholder="" style="width: 35%"></el-input>
          </el-form-item>
          <el-form-item label="联系客服">
            <el-upload
              action="https://jsonplaceholder.typicode.com/posts/"
              list-type="picture-card"
              :on-preview="handlePictureCardPreview"
              :on-remove="handleRemove"
            >
              <i class="el-icon-plus"></i>
            </el-upload>
          </el-form-item>
          <el-form-item label="上传图片">
            <el-row :gutter="20" type="flex">
              <el-col :span="3" v-for="(item, index) in 3" :key="index">
                <el-upload
                  action="https://jsonplaceholder.typicode.com/posts/"
                  list-type="picture-card"
                  :on-preview="handlePictureCardPreview"
                  :on-remove="handleRemove"
                >
                  <i class="el-icon-plus"></i>
                  <div class="upload-text">
                    <div>缩略图</div>
                    <div class="upload-hint">
                      <i class="el-icon-info"></i>
                      建议尺寸：245*145
                    </div>
                  </div>
                </el-upload>
              </el-col>
            </el-row>
          </el-form-item>
          <el-form-item>
            <el-button type="primary">保存</el-button>
            <el-button @click="back">返回</el-button>
          </el-form-item>
        </el-form>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      checkList: false,
    };
  },
  methods: {
    back() {
      this.$router.back()
    }
  }
};
</script>

<style lang="scss" scoped>
.sp {
  font-size: 12px;
  color: #bdbdbd;
  flex-shrink: 0;
  line-height: 10px;
}
</style>
